<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <%- include ../taglibs/layout_head.ejs%>
    <%- include ../taglibs/layout.css.ejs%>
    <link href="js/plugins/zTree/css/metroStyle/metroStyle.css" rel="stylesheet">
</head>
<body>
<%-include("../taglibs/header.ejs",{params:{className:"active",reportIsActive:"true"}})%>
<div class="nav-body" id="divContent">
    <div class="nav-box">
        <div class="row">
            <div class="col-sm-4 col-md-3 col-lg-2 nav-box-left-box">
                <%-include("reportManageLeftMenu.ejs",{params:{className:"active",stopreport:"true"}})%>
            </div>
            <div class="col-sm-6 col-md-9 col-lg-10 right-container-box">
                <ol class="head-breadcrumb">
                    <li>
                        <a>数据报表</a>
                    </li>
                    <li class="active">
                        停车报表
                    </li>
                </ol>
                <div class="right-container"  style="margin-top: 25px">
                    <section class="content content-search">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="col-sm-12 col-md-10">
                                    <div class="col-sm-12 col-md-12 content-search-left">
                                        <input type="text" name="carids" id="carids" hidden="hidden">
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                开始时间：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control   layer-date " id="start" name="start">
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                结束时间：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control   layer-date " id="end" name="end">
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                选择车辆：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text"
                                                       class="form-control" id="caridName" name="caridName" style="padding-right: 54px">
                                                <button type="button" class="btn btn-theme selectCar"
                                                        style="position: absolute;top: 0px;right: 0px;">选择</button>
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                车牌号：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control" id="baseCarNo" name="baseCarNo">
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                车主姓名：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control" id="userName" name="userName">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-12 col-md-2 " >
                                    <div class="col-sm-12 col-md-12 " >
                                        <button type="button" class="btn btn-round btn-theme" id="do_search" style="margin-bottom: 3px;margin-top: 3px">查 询</button>
                                        <button type="button" class="btn btn-round btn-danger" id="do_reset" style="margin-bottom: 3px;margin-top: 3px">重 置</button>
                                    </div>
                                    <div class="col-sm-12 col-md-12 " >
                                        <button type="button" class="btn btn-round btn-theme"   onclick="openExport()">导出列表</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>
                    <section class="content content-table">
                        <!--<section class="content-table-tools">
                            <div class="tools-box">
                                <button type="button" class="btn btn-round btn-add">新 增</button>
                                <button type="button" class="btn btn-round btn-danger">删 除</button>
                            </div>
                        </section>-->
                        <div style="display: block">
                            <table id="stopcarbaobiao"></table>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="myCarTreeDialog">
    <div class="modal-dialog" style="width: 320px;">
        <div class="modal-content" style="width: 320px;">
            <div class="modal-header">
                <button type="button" class="close" onclick="closeTreeDialog()">×</button>
                <h4 class="modal-title" id="NoPermissionModalLabel">车辆</h4>
            </div>
            <div class="modal-body" style="height:320px;max-height:320px;max-width: 320px;
                overflow: auto;">
                <ul id="userCommonTree" class="ztree">
                </ul>
            </div>
            <div class="modal-footer">
                <button class="btn btn-info"   type="button" onclick="getAllCheckNodes()">确 定</button>
            </div>
        </div>
    </div>
</div>
<%-include ../taglibs/layout.js.ejs%>
<script src="/js/plugins/zTree/js/jquery.ztree.all-3.5.js"></script>
<script src="/js/plugins/zTree/js/jquery.ztree.exhide-3.5.js"></script>
<script src="/js/ztree/ztree-cus-check.js"></script>
<script src="/js/ztree/ztree-user.js"></script>
<!--时间-->
<script src="js/plugins/layer/laydate/laydate.js"></script>
<script type="text/javascript" src="js/report/reportIndex.js"></script>
<!--<script type="text/javascript" src="js/viewpage/dataManage/userInfo/userInfo.js"></script>-->
<script type="text/javascript">
    $(function () {
        // UserInfo.initUserPage();
        var dataTable = new BootstrapTable($('#stopcarbaobiao'),{
            //url: '/dataManage/queryUserList',
            // data:[],
            // sidePagination: "client",
            url: '/stopcarreportManage/queryStopReportData',
            sidePagination: "server",
            height:500,
            queryParams:function (params) {
                var _searchParams = {
                    start:$("#start").val(),
                    end:$("#end").val(),
                }
                if($("#carids").val()){
                    _searchParams["carIds"] =$("#carids").val();
                }else{
                    _searchParams["baseCarNo"] =$("#baseCarNo").val();
                }
                _searchParams["userName"] = $("#userName").val()
                return $.extend(params,_searchParams);
            },
            columns: [{
                field: 'deptName',
                title: '所属用户'
            }, {
                field: 'baseCarNo',
                title: '车牌号'
            }, {
                field: 'userName',
                title: '车主姓名'
            }, {
                    field: 'stopTime',
                    title: '停车时长'
                }, {
                field: 'createAt',
                title: '停车时间'
            }
            //     {
            //     field: 'memo',
            //     title: '位置'
            // }
            ]
        });
        dataTable.init();
        var start = {
            elem: '#start',
            format: 'YYYY-MM-DD hh:mm:ss',
//            min: laydate.now(), //设定最小日期为当前日期
            max: '2999-06-16 23:59:59', //最大日期
//            start: laydate.now(),
//            start: laydate.now() + ' 00:00:00',
            istime: true,
            istoday: false,
            festival: true, //是否显示节日
            choose: function (datas) {
                if(datas){
                    end.min =datas.substring(0,10)+" 00:00:00"
                    end.start = datas.substring(0,10)+" 00:00:00"
                }
//                end.min = datas; //开始日选好后，重置结束日的最小日期
//                end.start = datas //将结束日的初始值设定为开始日
            }
//            min: laydate.now(-1), //-1代表昨天，-2代表前天，以此类推
//            max: laydate.now(+1) //+1代表明天，+2代表后天，以此类推
        };
        var end = {
            elem: '#end',
            format: 'YYYY-MM-DD hh:mm:ss',
//            min: laydate.now(),
            max: '2999-06-16 23:59:59',
//            start: laydate.now() + ' 23:59:59',
            istime: true,
            istoday: false,
            festival: true, //是否显示节日
            choose: function (datas) {
                var st=$("#start").val();
                if(st>datas){
                    swal({
                        title: "系统提示",
                        text: "开始时间必须小于结束时间!",
                        type: "error"
                    });
//                    $("#end").val(laydate.now() + ' 23:59:59');
                }else{
                    start.max = datas.substring(0,10)+" 23:59:59"; //结束日选好后，重置开始日的最大日期
                }
            }
        };
        laydate(start);
        laydate(end);
        $("#start").val(laydate.now() + ' 00:00:00');
        $("#end").val(laydate.now() + ' 23:59:59');
        var urlTree = '/tree/deptCar';
        initCartree('id', 'parentId', 'name',  fnClick,fnCheck, "checkbox");
        loadMyCarTree(urlTree,"userCommonTree",true);
        $(".selectCar").on("click",function () {
            $("#myCarTreeDialog").modal("show");
        });
        $("#do_search").on("click",function () {
            var _searchParams = {
                start:$("#start").val(),
                end:$("#end").val(),
            }
            if($("#carids").val()=="" && $("#baseCarNo").val()=="" && $("#userName").val()==""){
                return $.messageExt.alert("系统提示","请选择车辆或输入车牌号或输入车主姓名","warning");
            }
            if($("#carids").val()){
                _searchParams["carIds"] =$("#carids").val();
            }else{
                _searchParams["baseCarNo"] =$("#baseCarNo").val();
            }
            _searchParams["userName"] = $("#userName").val()
            dataTable.refresh({
                query:_searchParams
            });
            //queryChart()
        });
        $("#do_reset").on("click",function () {
            $("#start").val("");
            $("#end").val("");
            $("#carids").val("");
            $("#baseCarNo").val("")
            $("#caridName").val("");
        });
    });

    function closeTreeDialog() {
        $("#myCarTreeDialog").modal("hide");
    }

    /**
     *
     * @param id 当前节点id
     * @param pid 父节点id
     * @param name 显示名称
     */
    function initCartree(id,pid,name,fnClick,fnCheck,chkStyle){
        _idKey=id;
        _pIdKey=pid;
        _name=name;
        // _clickTree=flag;
        if(fnClick){
            _fnClick=fnClick;
        }
        if(fnCheck){
            _fnCheck=fnCheck;
        }
        var check={
            enable: false,
            // chkboxType: { "Y": "p", "N": "s" }
        };
        if(chkStyle){
            check={
                enable: true,
                chkStyle: chkStyle,
                // chkboxType: { "Y": "p", "N": "s" }
            };
        }
        setting = {
            view: {
                fontCss: getFontCss,
                selectedMulti: false,
                expandSpeed: "fast"
            },
            data: {
                simpleData: {
                    enable: true,
                    idKey: _idKey,
                    pIdKey: _pIdKey,
                    rootId: ""
                },
                key: {
                    name: _name
                }
            },
            check: check,
            callback: {
                onClick: _fnClick,
                onCheck: _fnCheck
            }
        }
    }
    function loadMyCarTree(url,treeid,asyncKey) {
        var ztreeId="kindTree";
        if(treeid){
            ztreeId=treeid;
        }
        $.ajax({
            async:asyncKey ? asyncKey : false,
            url: url,
            type: "post",
            dataType: 'json',
            success: function (data) {
                treeNodes_obj = data;
                for (var key in treeNodes_obj) {
                    treeNodes_obj[key].open = true;
                }
                zTree_obj = $.fn.zTree.init($("#"+ztreeId), setting, treeNodes_obj);
                tree_Obj = $.fn.zTree.getZTreeObj(ztreeId);
//                var node = tree_Obj.getNodeByParam("id", -1, null);
//                tree_Obj.selectNode(node);
                //cleanAll();
                //color
                // for(var i=0;i<treeNodes_obj.length;i++){
                //     var color=""
                //     if(treeNodes_obj[i].warningType=="0"){
                //
                //     }else if(treeNodes_obj[i].warningType=="1"){
                //
                //     }else if(treeNodes_obj[i].warningType=="2"){
                //
                //     }else if(treeNodes_obj[i].warningType=="3"){
                //
                //     }else if(treeNodes_obj[i].warningType=="5"){
                //
                //     }
                //
                //     // tree_Obj.setting.view.fontCss["color"]=
                //     //
                //     // tree_Obj.updateNode(treeNodes_obj[i]);
                // }

            }
        })
    }

    var fnCheck = function (event, treeId, treeNode) {
        //selectTreeNode(treeNode);
    }
    //    树节点选中
    var fnClick = function (event, treeId, treeNode) {
        selectTreeNode(treeNode);
    }


    //    复选框选中
    function selectTreeNode(treeNode) {
        var isCar = treeNode.isCar
        if (isCar) {
            $("#h_c_car_id").val(treeNode.id);
        }else{
            swal("系统提示", "请选择车辆查询!", "warning");

        }
    }
    function getAllCheckNodes() {
        var nodes = zTree_obj.getCheckedNodes(true);
        var nodeIds = [];
        var nodeNames = [];
        for(var n = 0,_len=nodes.length;n<_len;n++){
            var _node =nodes[n];
            if(_node.id!=-99999 && !_node.isParent){
                nodeIds.push(_node.id);
                nodeNames.push(_node.name);
            }
        }
        if(nodeIds.length){
            $("#caridName").val(nodeNames.toString());
            $("#carids").val(nodeIds.toString());
        }else{
            $("#caridName").val("");
            $("#carids").val("");
        }
        closeTreeDialog();
    }

    function openExport() {
        if($("#carids").val()){
            window.location.href = window.serveraddr+"/report/exportStopReporteExcel?start="+$("#start").val()+"&end="+$("#end").val()+"&userName="+$("#userName").val()+"&carIds="+$("#carids").val();
        }else{
            window.location.href = window.serveraddr+"/report/exportStopReporteExcel?start="+$("#start").val()+"&end="+$("#end").val()+"&userName="+$("#userName").val()+"&baseCarNo="+$("#baseCarNo").val();
        }
    }
</script>
</body>
</html>